<!--
 * @Description: 报表数据-表格
-->
<template>
  <div class="my-data">
    <div class="relation-data-title">
      <div>
        {{ data.subject }}
        <a-tooltip placement="leftTop" v-if="!isSummary && isCanCopy">
          <template slot="title"> <div v-html="helpText"></div> </template
          ><icon-font type="cap-icon-weibiaoti6-copy" class="icon-font" />
        </a-tooltip>
      </div>
      <span
        v-if="data.showMore"
        class="title-more"
        :href="moreUrl"
        @click="open"
        target="_blank"
        style="font-weight: 500;"
        >{{ moreLabel }}</span
      >
    </div>
      <a-table class="form-table-data" bordered :showHeader="!showSingleRow" :columns="tableData.columns" :data-source="tableData.dataSource" :scroll="{ x: true}"  :pagination="false" size="small">
       
      </a-table>
  </div>
</template>
<script>
  /*global openCtpWindow*/
  import { useTemplateStore } from '@/store/modules/template';
  import { mapWritableState } from 'pinia';
  import emitter from '@/plugins/global-callback';
  import globalData from '@/plugins/data';
  import mixins from '../mixins';
  import api from "@/api";

  export default {
    name: 'TableData',
    mixins: [mixins],
    data() {
      return {
        moreLabel: this.$i18n('common.more.label'),
        currentTemplateId: this.baseInfo.businessData?.template?.id
      };
    },
    computed: {
      ...mapWritableState(useTemplateStore, [
        'zwIframe',
        'isIframeReady',
        'zwIframeUrl',
        'zwIframeUrlCopy'
      ]),
      columns(){
        let map = this.data.showColFieldList.map(item=>{
          return  { title: item.display || item.value, width: 'auto', dataIndex: item.name.replace('#','_'), key: item.name };
        });
        console.log('columns',map)
        return  map
      },
      columnDataList(){
        let map = this.list.map(item=>{
          return {...item}
        });
        console.log('columnDataList',map)
        return map;
      },
      isCap4() {
        return this.baseInfo.zwIframe.isCap4;
      },
      //问号移上去的帮助性文案
      helpText() {
        return `${$.i18n('common.datarelation.note')}`
      },
      moreUrl() {
        const { affair } = this.baseInfo.businessData;
        let affairId = affair.id||'-1';
        let url = ''
        if (this.data?.capType === "4") {
          url = `${this.ctxPath}/report4Result.do?method=showResult&designId=${this.data.formQueryId}&type=drQuery&hidelocation=false&affairId=${affairId}&drPoId=${this.data.id}&queryId=${this.data.formQueryId}`
        } else {
          let zwIframe = window._getZWIframe()
          const formDataId = zwIframe.contentAPI.getContentDataId()
          url = `${this.ctxPath}/form/queryResult.do?method=queryExc&masterId=${formDataId}&type=drQuery&hidelocation=false&affairId=${affairId}&drPoId=${this.data.id}&queryId=${this.data.formQueryId}`
          if (!this.data?.formQueryId) {
            url = `${this.ctxPath}/form/queryResult.do?method=queryIndex&_resourceCode=T05_formQuery`
          }
        }
        console.log('url', url)
        return  url
      },
      // 是否是单行且按列显示
      showSingleRow() {
        return this.data?.vertical && (this.list?.length === 1 || this.data?.pageSize === 1)
      },
      tableData() {
        if (this.showSingleRow) {
          // 单行数据展示
          const data = this.columnDataList[0] || {}
          let head = []
          let list = []

          head = [{
            title: 'head0',
            width: 'auto',
            dataIndex: '_head_0',
            // customCell: () => {
            //   return {
            //     style: {
            //       background: '#e6e6e7'
            //     }
            //   }
            // }
          }, {
            title: 'head1',
            width: 'auto',
            dataIndex: '_head_1'
          }]
          this.columns.map(item => {
            list.push({
              _head_0: item.title,
              _head_1: data[item.dataIndex]
            })
          })
          return {
            columns: head,
            dataSource: list
          }
        } else {
          return {
            columns: this.columns,
            dataSource: this.columnDataList
          }
        }
      }
    },
    created() {
      this.ctxPath = globalData.ctxPath;
    },
  
    methods: {
      /**
       * @description: 生成标题。包含图标和内容
       * @param {Object}item 当前数据对象
       * @return {string}图标class
       */
      createTitle(item) {
        let title = '';
        //重要程度
        if (item.importantLevel !== '' && item.importantLevel !== 1) {
          title += ` <i class="ico16 important${item.importantLevel}_16"></i>`;
        }

        title += `<span>${item.subject}</span>`;

        //附件
        if (item.hasAttsFlag === true) {
          title += ` <i class="ico16 affix_16"></i>`;
        }

        //协同类型
        if (item.bodyType !== '10' && item.bodyType !== '30' && item.bodyType !== '90') {
          title += ` <i class="ico16  office${item.bodyType}_16"></i>`;
        }
        return title;
      },
      open() {
        if (this.data?.capType === "4") {
          this.requestCashId()
            .then(({conditionId}) => {
              openCtpWindow({
                url: this.moreUrl + `&conditionId=${conditionId}&cashId=${conditionId}`,
                id: this.data.dataTypeName
              });
            })
        } else {
          openCtpWindow({
            url: this.moreUrl,
            id: this.data.dataTypeName
          });
        }
      }
    }
  };
</script>
<style lang="scss" >
.my-data .form-table-data{
  .ant-table td,tr { white-space: nowrap; }
}
</style>
<style lang="scss" scoped>
  .my-data {
    .form-table-data{
      margin-top: 10px;
      margin-bottom: 10px;
    }
  }
  ::v-deep .form-table-data {
    th, td {
      height: 38px;
    }
  }
</style>
